<html>
    <head>
	    <meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;" />
		<meta name="apple-mobile-web-app-capable" content="yes"/>
		<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
    
        <title><g:layoutTitle default="Grails" /></title>
    	<link rel="stylesheet" href="${resource(file:'jquery-ui-1.8.12.custom.css', dir:'plugin/jquery-ui/css/smoothness')}" type="text/css" media="all" />
		<link rel="shortcut icon" href="${resource(dir:'images',file:'favicon.ico')}" type="image/x-icon" />
        <p:css name="iphone" />
        <p:css name="hex-floor" />
        <p:css name="player" /> 
        
        <g:layoutHead />
    </head>
    <body -dir="rtl">
        <div id="spinner" class="spinner" style="display:none;position: absolute;width:100%;height:100%;z-index:3000;background-color:#AAA;opacity:.5;text-align: center;">
            <img src="${resource(dir:'images',file:'spinner.gif')}" alt="${message(code:'spinner.alt',default:'Loading...')}" style="margin-top:100px" />
        </div>
        
        <g:layoutBody />
        
        <script src="${resource(file:'jquery-1.6.2.js', dir:'plugin/jquery')}" type="text/javascript" ></script>
		<script src="${resource(file:'jquery-ui-1.8.12.custom.min.js', dir:'plugin/jquery-ui/js')}" type="text/javascript" ></script>
		<script src="${resource(file:'jquery.tmpl.min.js', dir:'plugin/jquery.tmpl')}" type="text/javascript" ></script>
		<script src="${resource(file:'stomp.js', dir:'plugin/stomp')}"></script>
        <script src="${resource(file:'sencha-touch.js', dir:'plugin/sencha-touch-1.1.0') }"></script>
		<script src="${resource(file:'iscroll-min.js', dir:'plugin/iscroll') }"></script>
        
        <p:renderDependantJavascript />
    </body>
</html>